<template>
  <div>
    <Card>
      <div class="p-relative">
        <div @click="refresh" class="p-absolute refresh-btn">
          <Icon size='24' type="md-refresh" />
        </div>
        <div class="flex-box search-area">
          <div class="flex-item search-btn">
            <Button type="warning" @click='create'>添加门店</Button>
          </div>
          <div class="flex-item">
            <Input v-model="searchObj.name" placeholder="请输入门店名称"></Input>
          </div>

          <div class="flex-item search-btn" @click="search">
            <Button type="warning">搜索</Button>
          </div>
          <div class="flex-item search-btn" @click="reset">
            <Button>重置</Button>
          </div>

        </div>
      </div>
      <Table :columns="tableOption" :data="data.list" border :no-data-text="loadingText ? loadingText : '暂无数据'" border
        ref="tables" editable search-place="top">
        <template slot-scope="{ row, index }" slot="start_time">
          {{row.start_time}} - {{row.end_time}}
        </template>
        <template slot-scope="{ row, index }" slot="action">
          <div class="flex-box flex-center flex-margin">
            <Button type='warning' @click="edit(row, index)" size='small'>编辑</Button>
            <Button type='error' @click="del(row, index)" size='small'>删除</Button>

          </div>
        </template>
      </Table>
      <Page class="foot-page" :current='page.current' :total="page.total" :page-size="page.pageSize" show-total
        show-elevator @on-change="changepage"></Page>

    </Card>

    <!-- 添加弹窗 -->
    <Modal v-model="createModal" :title="createTitle" width='700'>

      <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
        <Tabs value="name1">
          <TabPane label="门店信息" name="name1">
            <FormItem label="门店名称" prop="name">
              <Input v-model="formValidate.name" placeholder="请输入门店名称"></Input>
            </FormItem>


            <FormItem label="省市区" prop='province'>
              <Cascader :data="areaData" v-model="formValidate.province" @on-change='areaChange'></Cascader>

            </FormItem>
            <FormItem label="街道地址" prop="address">
              <Input v-model="formValidate.address" placeholder="请输入街道地址"></Input>
            </FormItem>
            <FormItem label="地图设置" class='mapFormItem'>
                 <div class='flex-start-box'>
                   <Input v-model="formValidate.lat" placeholder="lat" style='width: 100px;margin-right: 10px;'></Input>
                   <Input v-model="formValidate.lng" placeholder="lng" style='width: 100px;margin-right: 10px;'></Input>
                   <Button type="primary" @click='setMap'>设置</Button>
                 </div>

            </FormItem>

             <!-- <FormItem label="设施" >
            <CheckboxGroup  v-model="formValidate.store_property_id" @on-change="changeCkeckbox">
              <Checkbox  :label="item.id" v-for="(item,index) in data.property_list">{{item.name}}</Checkbox>
            </CheckboxGroup>
          </FormItem> -->
            <FormItem label="门店电话" prop="tel">
              <Input v-model="formValidate.tel" placeholder="请输入门店电话"></Input>
            </FormItem>
            <FormItem label="营业时间" prop="time">
              <TimePicker type="timerange"   hide-disabled-options
                v-model="formValidate.time" format="HH:mm" placeholder="请选择营业时间例如:8:00-22:00" style="width: 250px">
              </TimePicker>

            </FormItem>
            <FormItem label="门店图片">
              <Button type="primary" @click="upload('album')">
                <Icon type="md-add" />
                上传图片
              </Button>
            </FormItem>
            <FormItem v-if="prodGroupBasicObj.album_imageArr && prodGroupBasicObj.album_imageArr.length">
              <div class="action-div" v-for="(item,index) in prodGroupBasicObj.album_imageArr"
                style="display: inline-block;margin-right: 10px;margin-bottom: 10px;">
                <div class="action-btn">
                  <!-- <span @click="previewImg">预览</span> -->
                  <span @click="delImg(index)">删除</span>
                </div>
                <img :src="item.url" style="width: 70px;height: 70px;border: 1px solid #eeeeee;" />
              </div>

            </FormItem>

            <FormItem label="营业状态">
              <RadioGroup v-model="formValidate.status">
                <Radio :label="item.value" v-for="(item,index) in type">{{item.name}}</Radio>&nbsp;&nbsp;&nbsp;&nbsp;

              </RadioGroup>
            </FormItem>

          </TabPane>
         <!--  <TabPane label="场地配置" name="name2">
            <Input  v-model="formValidate.config"   type="textarea" :autosize="{minRows: 10}" placeholder="请输入场地配置信息"></Input>

          </TabPane>
          <TabPane label="球馆介绍" name="name4">
             <Input v-model="formValidate.introduce"   type="textarea" :autosize="{minRows: 10}" placeholder="请输入球馆介绍"></Input>

          </TabPane> -->

        </Tabs>

      </Form>
      <div slot="footer">
        <Button type="warning" @click="save('formValidate')" :disabled="isDisable" :loading="isLoading">保存</Button>
      </div>
    </Modal>


    <Modal v-model="uploadModal" title="图片管理" class="uploadModal-wrap" :closable='isClosable'>
      <!-- 上传组件 -->
      <div>
        <UploadTool :showUpload='showUpload' :optionObj='uploadImgPathList' @getSelectedImgList='getSelectedImgList'>
        </UploadTool>
      </div>
      <div slot="footer">
        <Button @click='cancelUploadModal'>取消</Button>
        <Button type="primary" @click='confirm(uploadType)'>确定</Button>
      </div>
    </Modal>

    <!-- 删除弹窗 -->
    <Modal v-model="delModal" title="提示" width="250">
      <p class="font16">
        <Icon class='del-tips-icon' type="ios-alert-outline" color='orange' size='22' />确定删除该数据吗？
      </p>
      <div slot="footer">
        <Button @click='delModal=false'>取消</Button>
        <Button type="primary" @click='confirmDel'>确定</Button>
      </div>
    </Modal>

    <!-- 地图  -->
    <Modal v-model="showMapModel" title="地图" @on-ok="comfirmUpdateMap" @on-cancel="cancelUpdateMap" class-name="show-model"
     width="1200">
      <div class="outer-box" id="outer-box">
        <Row :gutter="16">
          <i-col span="12">
            <Row :gutter="12">
              <i-col span="6">
                <i-input v-model="formValidate.lat" placeholder="lat"></i-input>
              </i-col>
              <i-col span="6">
                <i-input v-model="formValidate.lng" placeholder="lng"></i-input>
              </i-col>
            </Row>
          </i-col>
        </Row>

        <div id="container" class="map" tabindex="0"></div>
        <div id="panel" class="scrollbar1">
          <div id="searchBar">
            <input id="searchInput" placeholder="输入关键字搜素POI" />
          </div>
          <div id="searchResults"></div>
        </div>
      </div>
      <div slot="footer">
        <Button @click='showMapModel=false'>取消</Button>
        <Button type="primary" @click='selectLocation'>确定</Button>
      </div>


    </Modal>

  </div>
</template>
<!-- 公共弹框，成功，失败，报错，loading -->
<script>
  import {
    mapState,
    mapMutations
  } from 'vuex'
  import {
    permission
  } from '@/config/permission.js'
  import 'quill/dist/quill.core.css'
  import 'quill/dist/quill.snow.css'
  import 'quill/dist/quill.bubble.css'
  import areaData from '@/config/city.js'
  // 接口
  import {
    getList,
    add,
    put,
    del
  } from '@/api/store-group/store'
  import {
    quillEditor,
    Quill
  } from 'vue-quill-editor'
  import {
    tableOption
  } from '../../../data/store-group/store.js'
  import Tables from '_c/tables'
  import {
    uploadImgPathList
  } from '@/config/global.js'
  // 上传组件
  import UploadTool from '../../components/uploadTool/uploadTool.vue'

  import ImageResize from 'quill-image-resize-module'

  Quill.register('modules/imageResize', ImageResize);
  export default {
    name: 'tables_page',
    components: {
      Tables,
      quillEditor,
      UploadTool
    },
    created() {
      let _this = this
      this.$nextTick(function() {

        // 权限校验
        _this.role_add = permission(this.roles, 'store/add')
        _this.role_edit = permission(this.roles, 'store/edit')
        _this.role_del = permission(this.roles, 'store/delete')

      })
      this.getList()
    },
    watch: {

    },
    mounted() {

    },
    computed: {
      ...mapState({
        prodGroupBasicObj: state => state.share.prodGroupBasicObj,
        prodGroupGoodsDetailObj: state => state.share.prodGroupGoodsDetailObj,
        roles: state => state.user.roles

      }),
    },
    data() {
      // 工具栏配置
      const toolbarOptions = [
        ['bold', 'italic', 'underline', 'strike'], // 加粗，斜体，下划线，删除线
        ['blockquote', 'code-block'], // 引用，代码块

        [{
          header: 1
        }, {
          header: 2
        }], // 标题，键值对的形式；1、2表示字体大小
        [{
          list: 'ordered'
        }, {
          list: 'bullet'
        }], // 列表
        [{
          script: 'sub'
        }, {
          script: 'super'
        }], // 上下标
        [{
          indent: '-1'
        }, {
          indent: '+1'
        }], // 缩进
        [{
          direction: 'rtl'
        }], // 文本方向

        [{
          size: ['small', false, 'large', 'huge']
        }], // 字体大小
        [{
          header: [1, 2, 3, 4, 5, 6, false]
        }], // 几级标题

        [{
          color: []
        }, {
          background: []
        }], // 字体颜色，字体背景颜色
        [{
          font: []
        }], // 字体
        [{
          align: []
        }], // 对齐方式

        ['clean'], // 清除字体样式
        ['image', 'video'] // 上传图片、上传视频
      ]
      let self = this;
      return {
        editorOption: {
          modules: {
            //imageDrop: true,
            imageResize: {
              displayStyles: {
                backgroundColor: "black",
                border: "none",
                color: "white"
              },
              modules: ["Resize", "DisplaySize", "Toolbar"]
            },

            toolbar: {
              container: toolbarOptions, // 工具栏
              handlers: {
                'image': function(val) {
                  console.log(val)
                  if (val) {
                    self.upload('detail')
                    // document.querySelector('.editor-upload').click()

                  } else {
                    this.quill.format('image', false); //禁用quill内部上传图片
                  }

                }

              }
            }
          }
          // some quill options
        },
        // emd
        // 权限标识
        role_add: false,
        role_edit: false,
        role_del: false,
        // ------------高德地图参数结束----------------
        showMapModel: false,
        tableOption: tableOption,
        delId: '',
        data: {
          property_list:[],
          detailProdList: [],
          store_class_list: [],
          list: [],
          order: {
            order_count: 0,
            amount: 0
          },
          detailForm: {

            // store_name: '朝阳门店',
            // class_name: '药店',
            // lat: '1145689',
            // lng: '1158969',
            // open_start_time: '08:00:00',
            // open_end_time: '18:00:00',
            // province_name: '山东省',
            // city_name: '青岛市',
            // area_name: '长岛区',
            // address: '长庚路112号',
            // tel: '0771-4789569',
            // is_maintain: 1,
            // audit: 0,
            // reason: '失败原因失败原因描述失败因描述失败原因描述描述'

          }
        },
        type: [{
            name: '营业',
            value: 1
          },
          {
            name: '暂停营业',
            value: 2
          },
          {
            name: '关闭',
            value: 0
          }
        ],
        lat: '',
        lng: '',
        // 上传
        // 子组件传递过来
        isClosable: false,
        previewImgModal: false,
        showMapModel:false,
        areaData: areaData.area, //城市
        uploadType: '', // 上传按钮判断
        uploadIndex: 0,
        fromChild: {
          selectedImgList: []
        },
        formItem:{
          lat:'',
          lng:'',
        },
        uploadModal: false,
        showUpload: false,
        uploadImgPathList: uploadImgPathList,
        // 上传
        tableOption: tableOption,
        delId: '',
        data: {
          list: []
        },
        areaData: areaData.area,
        createTitle: '新增门店',
        isAdd: true, // 新增true,修改false
        isDisable: false, // 新增时提交按钮点击状态
        isLoading: false, // 新增时提交按钮loading状态

        loadingText: '',
        tableData: [],
        checkboxPropert:[],
        // 查询参数
        searchObj: {
          name: ''

        },
        // 分页
        page: {
          pageSize: 8,
          current: 1,
          total: 0
        },
        uploadList: [],
        // 分页end
        // 弹窗状态
        createModal: false, // 新增，修改弹窗
        delModal: false, // 删除弹窗

        formValidate: {
          name: '',
          address: '',
          status: 1,
          tel: '',
          cancel_time: '0',
          images: [],
          price_table:[],
          time: '',
          murerplan:[],
          province_id: '',
          province_name: '',
          lat: '',
          lng: '',
          city_id: '',
          city_name: '',
          area_id: '',
          area_name: '',
          province:[],
          content:''
        },

        ruleValidate: {
          name: [{
            required: true,
            message: '请输入门店名称',
            trigger: 'blur'
          }],
          address: [{
            required: true,
            message: '请输入街道地址',
            trigger: 'blur'
          }],
          tel: [{
            required: true,
            message: '请输入门店电话',
            trigger: 'blur'
          }],
          time: [{
            required: true,
            message: '请输入营业时间',
            type: 'array',
            trigger: 'blur'
          }],
          cancel_time: [{
            required: true,
            message: '请输入预约取消时间',
            type: 'string',
            trigger: 'blur'
          }]
        },
        delImgItem: [],
      }
    },
    methods: {
      // 列表数据
      getList() {
        let _this = this
        let params = {
          page: this.page.current,
          size: this.page.size,
          name: this.searchObj.name
        }

        getList(params).then(res => {
          if (res.data.status == 1) {
            let result = res.data.data
            _this.data.list = result.list
            _this.page.total = result.total
            _this.page.pageSize = result.size
            _this.data.property_list =result.property
          } else {
            let config = {
              content: res.data.message,
              background: true
            }
            _this.$Message.error(config)
          }
        }).catch(function(error) {
          // 异常
          console.log(error)
        })
      },
      //上传图片过大提示
      handleMaxSize(file) {
        let msg = '图片' + file.name + '，超出了允许上传的10M大小'
        this.$Message.error(msg)
      },
      previewImg() {
        this.previewImgModal = true
      },
      delImg(index) {

        this.prodGroupBasicObj.album_imageArr.splice(index, 1);
        this.formValidate.images.splice(index, 1);
      },
      changepage(e) {
        this.page.current = e
        this.getList()
      },
      // 上传
      upload(type, index) {
        // type为上传的类型，‘cover’封面
        this.uploadModal = true
        this.showUpload = true
        this.uploadType = type
        this.uploadIndex = index
      },
      getSelectedImgList(e) {
        this.fromChild.selectedImgList = e
      },
      cancelUploadModal() {
        this.uploadModal = false
        this.showUpload = false
      },
      confirm(type) {
        let _this = this



        if (type == 'cover') {
           _this.formValidate.price_table = [];
          // 封面
          let obj = {
            url:'',
            path:''
          };

          obj.url = this.fromChild.selectedImgList[0].url;
          // obj.cover_image_type = this.fromChild.selectedImgList[0].extension;
          obj.path = this.fromChild.selectedImgList[0].path_name;
          _this.formValidate.price_table.push(obj)

        }else if (type == 'murerplan') {
              _this.formValidate.murerplan = [];
          // 封面
          let obj = {
            url:'',
            path:''
          };

          obj.url = this.fromChild.selectedImgList[0].url;
          // obj.cover_image_type = this.fromChild.selectedImgList[0].extension;
          obj.path = this.fromChild.selectedImgList[0].path_name;
          _this.formValidate.murerplan.push(obj)

        }else if(type=='detail'){
          let quill = this.$refs.myQuillEditor.quill;
          this.fromChild.selectedImgList.forEach(function(cv) {
            let length = quill.selection.savedRange.index
            // 插入图片
            quill.insertEmbed(length, 'image', cv.url)
            //quill.insertEmbed(length, 'video', url)
            // 调整光标到最后
            quill.setSelection(length + 1)

          })
          this.uploadModal = false;
          this.showUpload = false;
        }else{
             _this.formValidate.images = [];
          let obj = this.prodGroupBasicObj;
          obj.album_imageArr = this.fromChild.selectedImgList.map((res => {
            _this.formValidate.images.push(res.path_name);
            return {
              url: res.url,
              extension: res.extension,
              file_name: res.path_name
            }
          }))
        }

        this.uploadModal = false
      },
      // 新增
      create() {
        if (!this.role_add) {
          let config = {
            content: '您没有操作权限',
            background: true
          }
          this.$Message.error(config)
          return
        }
        this.createModal = true

        this.createTitle = '新增门店'
        this.isAdd = true
        this.formValidate = {} // 表单重置
        this.formValidate.status = 1;
        this.prodGroupBasicObj.album_imageArr = {}
        this.formValidate.price_table = []
        this.formValidate.murerplan = []
        this.fromChild.selectedImgList = [];
        this.formValidate.lat =''
        this.formValidate.lng =''
        this.lat = ''
        this.lng = ''

        this.handleReset('formValidate') // 验证重置
      },
      // 修改
      edit(row) {
        if (!this.role_edit) {
          let config = {
            content: '您没有操作权限',
            background: true
          }
          this.$Message.error(config)
          return
        }
        this.createModal = true
        this.createTitle = '编辑门店'
        this.isAdd = false
        this.formValidate = {} // 表单重置
        let obj = JSON.parse(JSON.stringify(row))
        this.formValidate = obj
        this.formValidate.province = [obj.province_id, obj.city_id, obj.area_id]
        this.prodGroupBasicObj.album_imageArr = this.formValidate.imagesArr
        this.formValidate.province = []
        if(row.province_id>0){
           this.formValidate.province = [row.province_id, row.city_id, row.area_id]
        }


        this.fromChild.selectedImgList = [];
        this.handleReset('formValidate') // 验证重置
      },

      // 删除
      del(row) {
        if (!this.role_del) {
          let config = {
            content: '您没有操作权限',
            background: true
          }
          this.$Message.error(config)
          return
        }
        this.delId = row.id
        this.delModal = true

        // 删除接口
      },
      confirmDel() {
        let _this = this
        let obj = {
          id: this.delId
        }
        del(obj).then(res => {
          if (res.data.status == 1) {

            _this.delModal = false
            _this.$Message.success('操作成功')
            _this.getList() // 重新刷新数据
          } else {
            _this.delModal = false

          }
        }).catch(function(error) {
          // 异常
          _this.delModal = false
          console.log(error)
        })
      },
      // 刷新
      refresh() {
        this.searchObj = {} // 清空搜索框
        this.getList()
      },
      // 重置
      reset() {
        this.searchObj = {} // 清空搜索框
        this.getList()
      },
      // 查询
      search() {
        this.getList()
      },
      changeCkeckbox(e){
        this.checkboxPropert = [];
        this.data.property_list.forEach((item)=>{
          if (e.indexOf(item.id)>=0) {
            this.checkboxPropert.push(item);

          }
        })


      },

      save(name) {

        let _this = this

        this.$refs[name].validate((valid) => {
          if (valid) {

            if(_this.formValidate.lat=='' || _this.formValidate.lng==''){
              _this.$Message.error('请设置地图经纬度');
              return ;
            }

            if (_this.isAdd) {

              // 新增
              let obj = {
                name: _this.formValidate.name,
                time: _this.formValidate.time,
                address: _this.formValidate.address,
                tel: _this.formValidate.tel,
                status: _this.formValidate.status,
                cancel_time: _this.formValidate.cancel_time,
                images: _this.formValidate.images || '',
                detail: _this.formValidate.detail,
                site: _this.formValidate.site,
                site_height: _this.formValidate.site_height,
                parking_fee: _this.formValidate.parking_fee,
                texture: _this.formValidate.texture,
                lights: _this.formValidate.lights,
                air: _this.formValidate.air,
                fanner: _this.formValidate.fanner,
                wc: _this.formValidate.wc,
                bathroom: _this.formValidate.bathroom,

                property:_this.checkboxPropert || [],

                lat: _this.formValidate.lat,
                lng: _this.formValidate.lng,
                province_id: _this.formValidate.province_id,
                province_name: _this.formValidate.province_name,
                city_id: _this.formValidate.city_id,
                city_name: _this.formValidate.city_name,
                area_id: _this.formValidate.area_id,
                area_name: _this.formValidate.area_name,
                introduce:_this.formValidate.introduce,
                config:_this.formValidate.config

              }

              // 新增接口
              add(obj).then(res => {
                if (res.data.status == 1) {
                  _this.prodGroupBasicObj.album_imageArr = {};
                   _this.formValidate.price_table = []
                  _this.formValidate.murerplan = []
                  _this.createModal = false
                  _this.getList() // 重新刷新数据
                  _this.$Message.success('操作成功')
                } else {

                  // axios响应拦截
                }
              }).catch(function(error) {
                // 异常
                _this.createModal = false
                console.log(error)
              })
            } else {
              // 修改

              let obj = {
                id: _this.formValidate.id,
               name: _this.formValidate.name,
               time: _this.formValidate.time,
               address: _this.formValidate.address,
               tel: _this.formValidate.tel,
               status: _this.formValidate.status,
               cancel_time: _this.formValidate.cancel_time,
               images: _this.formValidate.images || '',
               detail: _this.formValidate.detail,
               site: _this.formValidate.site,
               site_height: _this.formValidate.site_height,
               parking_fee: _this.formValidate.parking_fee,
               texture: _this.formValidate.texture,
               lights: _this.formValidate.lights,
               air: _this.formValidate.air,
               fanner: _this.formValidate.fanner,
               wc: _this.formValidate.wc,
               bathroom: _this.formValidate.bathroom,

               property:_this.checkboxPropert || [],

               lat: _this.formValidate.lat,
               lng: _this.formValidate.lng,
               province_id: _this.formValidate.province_id,
               province_name: _this.formValidate.province_name,
               city_id: _this.formValidate.city_id,
               city_name: _this.formValidate.city_name,
               area_id: _this.formValidate.area_id,
               area_name: _this.formValidate.area_name,
               introduce:_this.formValidate.introduce,
               config:_this.formValidate.config

              }

              // 修改接口
              put(obj).then(res => {
                if (res.data.status == 1) {
                  _this.prodGroupBasicObj.album_imageArr = {};

                  _this.createModal = false
                  _this.getList() // 重新刷新数据
                  _this.$Message.success('操作成功')
                } else {

                }
              }).catch(function(error) {
                // 异常
                console.log(error)
              })
            }

          } else {
            this.$Message.error('请输入必填项!')
          }
        })
      },
      handleReset(name) {
        this.$refs[name].resetFields()
      },
      escapeStringHTML(str) {
        // 转码
        str = str.replace(/&lt;/g, '<');
        str = str.replace(/&gt;/g, '>');
        return str;
      },



      areaChange (value, selectedData) {
        if (JSON.stringify(selectedData) === '[]') {
          return false
        }


        this.formValidate.province_id = selectedData[0].value
        this.formValidate.province_name = selectedData[0].label
        this.formValidate.city_id = selectedData[1].value
        this.formValidate.city_name = selectedData[1].label
        this.formValidate.area_id = selectedData[2].value
        this.formValidate.area_name = selectedData[2].label
      },


      onEditorBlur(quill) {


      },
      onEditorFocus(quill) {


      },
      onEditorReady(quill) {

      },
      onEditorChange({
        quill,
        html,
        text
      }) {

        this.formValidate.detail=this.escapeStringHTML(html)


      },
      // 地图———————————————————————————————开始
      selectLocation () {
        if (!this.formValidate.lat || !this.formValidate.lng) {
          this.$Message.error('请选择经纬度')
          return
        }
        this.showMapModel = false

      },
      setMap () {
         let _this = this
       if (this.keyword == '') {
         this.$Message.error('地址详情不能为空')
         return false
       }
       if (this.formValidate.province.length == 0 || !this.formValidate.address) {
          this.$Message.error('请选择省市区，并输入详细地址')
          return
        }

       let content = _this.formValidate.province_name + _this.formValidate.city_name + _this.formValidate.area_name +
           _this.formValidate.address
       this.formValidate.content = JSON.parse(JSON.stringify(content))
       this.keyword = JSON.parse(JSON.stringify(content))
       this.initMap()
       this.showMapModel = true
      },
      // 弹窗初始化地图
      initMap () {
        let vm = this
         var map = new AMap.Map('container', {
              zoom: 10
          })
          AMapUI.loadUI(['misc/PoiPicker'], function (PoiPicker) {
                var poiPicker = new PoiPicker({
                    input: 'searchInput',
                    placeSearchOptions: {
                        map: map,
                        pageSize: 10
                    },
                    searchResultsContainer: 'searchResults'
                })

                poiPicker.on('poiPicked', function (poiResult) {
                    poiPicker.hideSearchResults()

                    var source = poiResult.source,
                        poi = poiResult.item

                    if (source !== 'search') {
                        // suggest来源的，同样调用搜索
                        poiPicker.searchByKeyword(poi.name)
                    } else {
                         // console.log(poi.location.lat)
                         // console.log(poi.location.lng)
                      //  console.log(poi);
                      vm.formValidate.lat = poi.location.lat
                      vm.formValidate.lng = poi.location.lng
                      vm.formValidate.lat_lng = poi.location.lat + ',' + poi.location.lng
                    }
                   // $("#searchResults").toggleClass("hidden");
                })

                poiPicker.onCityReady(function () {
                    poiPicker.searchByKeyword(vm.keyword)
                })
          })
      },
      cancelUpdateMap () {
        this.showMapModel = false
        // this.keyword = "";
      },
      comfirmUpdateMap () {

      },
    }

  }
</script>

<style lang="scss">
  @import "./index";
</style>
